<template>
  <div>
    <!-- 底部选项卡 -->
    <!-- <van-tabbar v-model="selected" fixed>
      <van-tabbar-item name="page" icon="home-o">首页</van-tabbar-item>
      <van-tabbar-item name="service" icon="like-o">云图</van-tabbar-item>
      <van-tabbar-item name="consult" icon="chat-o">咨询</van-tabbar-item>
      <van-tabbar-item name="me" icon="friends-o">我的</van-tabbar-item>
    </van-tabbar> -->

     <van-tabbar route fixed v-model="$store.state.selected" :ins="ins">
      <van-tabbar-item name="page" replace  icon="home-o" to="/">首页</van-tabbar-item>
      <van-tabbar-item name="service" replace icon="location-o" to="/fymap">云图</van-tabbar-item>
      <van-tabbar-item name="consult" replace icon="chat-o" to="/mychat">咨询</van-tabbar-item>
      <van-tabbar-item name="me" replace to="/mypage" icon="friends-o">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selected: '',
      ins:'',
      active:0
    };
  },
  
  watch: {
    // 底部选项卡 selected改变时触发/** 监听selected的变化 一旦有变化 vue将会执行该方法 * 并且传入两个参数：从 oldval 更改newval */
    // selected(newVal) {
    //   if (newVal == "page") {
    //     this.$router.push("/");
    //   } else if (newVal == "service") {
    //     this.$router.push("/fymap");
    //   } else if (newVal == "consult") {
    //     this.$router.push("/mychat");
    //   } else if (newVal == "me") {
    //     this.$router.push("/mypage");
    //   }
    // },
  },
  methods:{
  
    // gohome(){
    //   this.$router.push("/") 
    // },
    // goyun(){
    //   this.$router.push("/fymap") 
    // },
    // gochat(){
    //   this.$router.push('/mychat')
    // },
    // gome(){
    //   this.$router.push('mypage').catch(()=>{})
    // }    

  }
};
</script>